<template>
    <div>
        <div><van-nav-bar title="搜索" arrow-left="" left-arrow @click-left="onClickLeft" />
        </div>
        <div class="box1">
            <van-search v-model.trim="value" placeholder="请输入书名/isbn搜索" shape="round" @keydown.enter="btn" />
            <div class="search">
                <p>
                    搜索
                </p>
            </div>
        </div>
        <div v-for="item in Search1">
            {{ item.bname }}
        </div>
    </div>
</template>

<script setup>
import { onMounted, ref } from 'vue';
import { getSearch } from './api'
const value = ref('')
const Search1 = ref([])
const Search = ref([])
const btn = () => {
    getSearch(value.value).then(res => {
        Search.value = res.data.data
        console.log(res, '搜索')
    })
}
// const btn = () => {
//     Search1.value = Search.value.filter(item => item.bname.includes(value.value))
// }
// onMounted(() => {
//     setSearch()
// })
const onClickLeft = () => history.back();
</script>
<style lang="scss" scoped>
.box1 {
    display: flex;

    .van-search {
        width: 315px;
    }

    .search {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 60px;
        height: 35px;
        background: red;
        border-bottom-left-radius: 20px;
        border-bottom-right-radius: 20px;
        border-top-left-radius: 20px;
        border-top-right-radius: 20px;
        margin-top: 10px;
        font-size: 16px;
        color: #fff;
        background: #cfc661;
    }
}
</style>
